{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!-- title模板 -->
    <title>{% block title %}主页{% endblock %}</title>
    <!-- title模板end -->

    <!-- css模板 -->
    {% block css_add %}
        <link rel="stylesheet" href="{% static 'css/base/reset.css' %}">
        <link rel="stylesheet" href="{% static 'css/base/common.css' %}">
        <link rel="stylesheet" href="{% static 'css/base/side.css' %}">
        {% block css_self %}
            <link rel="stylesheet" href="{% static 'css/news/index.css' %}">
            <script> pageIndex = 0 </script>
        {% endblock %}
        <link rel="stylesheet" href="http://at.alicdn.com/t/font_684044_un7umbuwwfp.css">
    {% endblock %}
    <!-- css模板end -->
</head>
<body>
    <!-- header start -->
    {% block header %}
        <header id="header">
            <div class="mw1200 header-contain clearfix">
                <!-- logo start -->
                <h1 class="logo">
                  <a href="javascript:void(0);" class="logo-title">Python</a>
                </h1>
                <!-- logo end -->
                <!-- nav start -->
                <nav class="nav">
                  <ul class="menu">
                    <li class="active"><a href="{% url 'news' %}">首页</a></li>
                    <li><a href="{% url 'course' %}">在线课堂</a></li>
                    <li><a href="{% url 'doc' %}">下载文档</a></li>
                    <li><a href="search.html">搜索</a></li>
                  </ul>
                </nav>
                <!-- nav end -->
                <!-- login start -->
                <div class="login-box">
                      <div>
                          <i class="PyWhich py-user"></i>
                          <span>
                              <a href="{% url 'login' %}" class="login">登录</a> / <a href="{% url 'reg' %}"
                                                                                      class="reg">注册</a>
                          </span>
                      </div>
                      <div class="author hide">
                          <i class="PyWhich py-user"></i>
                          <span>qwertyui</span>
                          <ul class="author-menu">
                              <li><a href="javascript:void(0);">后台管理</a></li>
                              <li><a href="javascript:void(0);">退出登录</a></li>
                          </ul>
                      </div>
                  </div>
                <!-- login end -->
              </div>
        </header>
    {% endblock %}
    <!-- header end -->

    <!-- main start -->
    {% block main %}
        <main id="main">
            <div class="w1200 clearfix">
                <!-- main-contain 模板 start -->
                {% block main_contain %}
                    <!-- main-contain start  -->
                    <div class="main-contain">
              <!-- banner start -->
                <div class="banner">
                    <ul class="pic">
                        <!--淡入淡出banner-->


                        <li><a href="javascript:void(0);"><img src="{% static 'images/linux.jpg' %}" alt="test"></a></li>


                        <li><a href="javascript:void(0);"><img src="{% static 'images/python_gui.jpg' %}" alt="test"></a></li>


                        <li><a href="javascript:void(0);"><img src="{% static 'images/python_function.jpg' %}" alt="test"></a></li>


                        <li><a href="javascript:void(0);"><img src="{% static 'images/python_advanced.jpg' %}" alt="test"></a></li>


                        <li><a href="javascript:void(0);"><img src="{% static 'images/jichujiaochen.jpeg' %}" alt="test"></a></li>


                        <li><a href="javascript:void(0);"><img src="{% static 'images/python_web.jpg' %}" alt="test"></a></li>


                    </ul>
                    <a href="javascript:void(0);" class="btn prev">
                        <i class="PyWhich py-arrow-left"></i></a>
                    <a href="javascript:void(0);" class="btn next">
                        <i class="PyWhich py-arrow-right"></i></a>
                    <ul class="tab">
                        <!-- 按钮数量必须和图片一致 -->


                        <li></li>


                        <li></li>


                        <li></li>


                        <li></li>


                        <li></li>


                        <li></li>


                    </ul>
                </div>
              <!-- banner end -->

              <!-- content start -->
              <div class="content">
                <!-- recommend-news start -->
                  <ul class="recommend-news">
                      <li>
                          <a href="https://www.shiguangkey.com/course/2432" target="_blank">
                              <div class="recommend-thumbnail">
                                  <img src="{% static 'images/python_gui.jpg' %}" alt="title">
                              </div>
                              <p class="info">Python GUI 教程 25行代码写一个小闹钟</p>
                          </a>
                      </li>

                      <li>
                          <a href="https://www.shiguangkey.com/course/2432" target="_blank">
                              <div class="recommend-thumbnail">
                                  <img src="{% static 'images/python_advanced.jpg' %}" alt="title">
                              </div>
                              <p class="info">python高性能编程方法一</p>
                          </a>
                      </li>

                      <li>
                          <a href="https://www.shiguangkey.com/course/2432" target="_blank">
                              <div class="recommend-thumbnail">
                                  <img src="{% static 'images/jichujiaochen.jpeg' %}" alt="title">
                              </div>
                              <p class="info">python基础 split 和 join函数比较</p>
                          </a>
                      </li>
                  </ul>
                <!-- recommend-news end -->

                <!--  news-nav start-->
                  <nav class="news-nav">
                      <ul class="clearfix">
                          <li class="active"><a href="javascript:void(0)">最新资讯</a></li>

                          <li><a href="javascript:void(0)" data-id="1">python框架</a>
                          </li>

                          <li><a href="javascript:void(0)" data-id="2">Python基础</a>
                          </li>

                          <li><a href="javascript:void(0)" data-id="3">Python高级</a>
                          </li>

                          <li><a href="javascript:void(0)" data-id="4">Python函数</a>
                          </li>

                          <li><a href="javascript:void(0)" data-id="5">PythonGUI</a>
                          </li>

                          <li><a href="javascript:void(0)" data-id="6">Linux教程</a>
                          </li>

                      </ul>
                  </nav>
                <!--  news-nav end -->

                <!-- news-contain start -->
                  <div class="news-contain">
                      <ul class="news-list">

                          <li class="news-item">
                              <a href="https://www.shiguangkey.com/course/2432" class="news-thumbnail"
                                 target="_blank">
                                  <img src="{% static 'images/linux.jpg' %}" alt="linux查找文件或目录命令"
                                       title="linux查找文件或目录命令">
                              </a>
                              <div class="news-content">
                                  <h4 class="news-title"><a
                                          href="#">linux查找文件或目录命令</a>
                                  </h4>
                                  <p class="news-details">linux查找文件或目录命令，前提：知道文件或者目录的具体名字，例如：sphinx.conffind 查找find / -name
                                      dirname 查找目录find -name...</p>
                                  <div class="news-other">
                                      <span class="news-type">Linux教程</span>
                                      <span class="news-time">11/11 18:24</span>
                                      <span class="news-author">python</span>
                                  </div>
                              </div>
                          </li>

                          <li class="news-item">
                              <a href="https://www.shiguangkey.com/course/2432" class="news-thumbnail"
                                 target="_blank">
                                  <img src="{% static 'images/linux.jpg' %}" alt="linux下svn命令的使用"
                                       title="linux下svn命令的使用">
                              </a>
                              <div class="news-content">
                                  <h4 class="news-title"><a
                                          href="https://www.shiguangkey.com/course/2432/887">linux下svn命令的使用</a>
                                  </h4>
                                  <p class="news-details">1、将文件checkout到本地目录svn checkout path（path是服务器上的目录） 例如：svn checkout
                                      svn://192.168.1.1/pro/domain 简写：svn co2、往版本库中添加新的文件 svn addfile 例如：svn add te...</p>
                                  <div class="news-other">
                                      <span class="news-type">Linux教程</span>
                                      <span class="news-time">11/11 18:24</span>
                                      <span class="news-author">python</span>
                                  </div>
                              </div>
                          </li>

                          <li class="news-item">
                              <a href="https://www.shiguangkey.com/course/2432" class="news-thumbnail"
                                 target="_blank">
                                  <img src="{% static 'images/linux.jpg' %}" alt="实现linux和windows文件传输"
                                       title="实现linux和windows文件传输">
                              </a>
                              <div class="news-content">
                                  <h4 class="news-title"><a
                                          href="https://www.shiguangkey.com/course/2432/886">实现linux和windows文件传输</a>
                                  </h4>
                                  <p class="news-details">
                                      其实这个题目有点大，这里介绍的只是linux和windows文件传输中的一种，但是这种方法却非常实用，那就是：ZModem协议具体是linux命令是：rz...</p>
                                  <div class="news-other">
                                      <span class="news-type">Linux教程</span>
                                      <span class="news-time">11/11 18:24</span>
                                      <span class="news-author">python</span>
                                  </div>
                              </div>
                          </li>

                          <li class="news-item">
                              <a href="https://www.shiguangkey.com/course/2432" class="news-thumbnail"
                                 target="_blank">
                                  <img src="{% static 'images/linux.jpg' %}" alt=".htaccess配置详解"
                                       title=".htaccess配置详解">
                              </a>
                              <div class="news-content">
                                  <h4 class="news-title"><a
                                          href="https://www.shiguangkey.com/course/2432">.htaccess配置详解</a>
                                  </h4>
                                  <p class="news-details">　　.htaccess文件设置基础教程 如果你设置好了比如常用的404页面 301重定向 页面还有500页面等会设置了
                                      无非对你的seo技术有很大帮助那么 .htaccess文件到底怎么设置呢　　- .htaccess 文件(或者&quot;分布式...</p>
                                  <div class="news-other">
                                      <span class="news-type">Linux教程</span>
                                      <span class="news-time">11/11 18:24</span>
                                      <span class="news-author">python</span>
                                  </div>
                              </div>
                          </li>

                          <li class="news-item">
                              <a href="https://www.shiguangkey.com/course/2432" class="news-thumbnail"
                                 target="_blank">
                                  <img src="{% static 'images/linux.jpg' %}" alt="使用nohup命令让linux程序后台运行"
                                       title="使用nohup命令让linux程序后台运行">
                              </a>
                              <div class="news-content">
                                  <h4 class="news-title"><a
                                          href="https://www.shiguangkey.com/course/2432">使用nohup命令让linux程序后台运行</a>
                                  </h4>
                                  <p class="news-details">使用nohup让程序永远后台运行Unix/Linux下一般比如想让某个程序在后台运行，很多都是使用 &amp;
                                      在程序结尾来让程序自动运行。比如我们要运行mysql在后台：/usr/local/mysql/bin/mysqld_safe --user=mysql &amp;但是...</p>
                                  <div class="news-other">
                                      <span class="news-type">Linux教程</span>
                                      <span class="news-time">11/11 18:24</span>
                                      <span class="news-author">python</span>
                                  </div>
                              </div>
                          </li>

                      </ul>
                  </div>
                <!-- news-contain end -->

                <!-- btn-more start -->
                <a href="javascript:void(0);" class="btn-more">加载更多</a>
                <!-- btn-more end -->
              </div>
              <!-- content end -->
            </div>
                    <!-- main-contain  end -->
                {% endblock %}
                <!-- main-contain 模板 end -->

                <!-- side 模板 start -->
                {% block side %}
                    <!-- side start -->
                    <aside class="side">
                  <div class="side-activities">
                      <h3 class="activities-title">在线课堂<a href="javascript:void(0)">更多</a></h3>
                      <div class="activities-img">
                          <a href="javascript:void(0);" target="_blank">
                              <img src="{% static 'images/english.jpg' %}" alt="title">
                          </a>
                          <p class="activities-tips">对话国外小姐姐</p>
                      </div>
                      <ul class="activities-list">
                          <li>
                              <a href="javascript:void(0);" target="_blank">
                                  <span class="active-status active-start">报名中</span>
                                  <span class="active-title"><a
                                          href="https://www.shiguangkey.com/course/2432"> Django 项目班</a></span>
                              </a>
                          </li>
                          <li>
                              <a href="javascript:void(0);" target="_blank">
                                  <span class="active-status active-end">已结束</span>
                                  <span class="active-title"><a
                                          href="https://www.shiguangkey.com/course/2321">Python入门基础班</a></span>
                              </a>
                          </li>
                      </ul>
                  </div>
                  <div class="side-attention clearfix">
                      <h3 class="attention-title">关注我</h3>
                      <ul class="side-attention-address">
                          <li>
                              <a href="javascript:void(0);" target="_blank"><i class="PyWhich py-GitHub"></i>XinLan</a>
                          </li>
                          <li>
                              <a href="javascript:void(0);" target="_blank"><i class="PyWhich py-zhihu"
                                                                               style="color:rgb(0, 108, 226);"></i>XinLan</a>
                          </li>
                          <li>
                              <a href="javascript:void(0);" target="_blank"><i class="PyWhich py-weibo"
                                                                               style="color:rgb(245,92,110);"></i>XinLan</a>
                          </li>
                      </ul>
                      <div class="side-attention-qr">
                          <p>扫码关注</p>
                      </div>
                  </div>

                  <div class="side-hot-recommend">
                      <h3 class="hot-recommend">热门推荐</h3>
                      <ul class="hot-news-list">

                          <li>
                              <a href="javascript:void(0)" class="hot-news-contain clearfix">
                                  <div class="hot-news-thumbnail">
                                      <img src="{% static 'images/python_web.jpg' %}"
                                           alt="">
                                  </div>
                                  <div class="hot-news-content">
                                      <p class="hot-news-title">Django调试工具django-debug-toolbar安装使用教程</p>
                                      <div class="hot-news-other clearfix">
                                          <span class="news-type">python框架</span>
                                          <!-- 自带的 -->
                                          <time class="news-pub-time">11月11日</time>
                                          <span class="news-author">python</span>
                                      </div>
                                  </div>
                              </a>
                          </li>

                      </ul>
                  </div>


              </aside>
                    <!-- side end -->
                {% endblock %}
                <!-- side 模板 end -->
            </div>
        </main>
    {% endblock %}
    <!-- main end -->

    <!-- footer start -->
    {% block footer %}
        <footer id="footer">
    <div class="footer-box">
        <div class="footer-content">
            <p class="top-content">
					<span class="link">
						<a href="javascript:void(0)">关于Python</a> |
						<a href="javascript:void(0)">我就是我</a> |
						<a href="javascript:void(0)">人生苦短</a> |
						<a href="javascript:void(0)">我用Python</a>
					</span>
                <span class="about-me">关于我: <i class="PyWhich py-wechat"></i> XinLan</span>
            </p>
            <p class="bottom-content">
                <span>地址： xxxx</span>
                <span>联系方式: <a href="tel:400-1567-315">400-1567-315</a> (24小时在线)</span>
            </p>
        </div>
        <p class="copyright-desc">
            Copyright &copy; 2008 - 2018 xxx有限公司. All Rights Reserved
        </p>
    </div>
</footer>
    {% endblock %}
    <!-- footer end -->

    <!-- js  start  -->
    {% block script %}
        <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
        <script src="{% static 'js/base/common.js' %}"></script>
        <script src="{% static 'js/base/message.js' %}"></script>
        {% block script_self %}
            <script src="{% static 'js/base/index.js' %}"></script>
        {% endblock %}
    {% endblock %}
    <!-- js  end  -->
</body>
</html>